<!DOCTYPE html>
<html  xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0, user-scalable=0, minimum-scale=1.0,maximum-scale=1.0" />
<!-- jquery库 -->
		  <script type="text/javascript" src="../common/meta.js"></script>
		<script src="productCatagory.js"></script>
		<script type="text/javascript" src="./cache.js"></script> 
   
		<style>
		 
        #pullToUP #pullUp .message span.pullLabel:after { content: "加载更多数据"; }
		#pullToUP  #pullUp.flip .message span.pullLabel:after { content: "松开手指刷新数据"; }
		#pullToUP #pullUp.loading .message span.pullLabel:after { content: "正在加载中..."; }
		
	    table th{
	     background-color: #49afcd;
	     color:#fff;
	    }
	    	    .panel{
    		margin:10px;
    		border:1px solid;
    		border-color: gray;
    		padding: 2px;
    		border-radius:8px;
    	}
		.ui-body-c, .ui-overlay-c {
	    	background: none;
	    	color: #333;
		}	
		.home{
		 	margin-top:5px;
		 	float:right;
		 }
		.ui-header .ui-title{
		    font-size: 18px;
		}  
		       ul, ol {
			margin: 0 0 0px 0px;
			padding: 0;
		}
         .back{
		 	margin-top:5px;
             float:left;
             }
	  </style>    
</head>
<body>
<input type="text" id="catagoryId" ></input>
<div id="searchPage" data-role="page" class="bodyframe">
	   <div data-role="header" class="theme-info">
        <ul class="back">
	   		<a   href="main.html"><image src='../image/left_48.png'></image></a>
	   	</ul>
		  <ul class="home">
		   		<a  id="home" ><image src='../image/home_48.ico'></image></a>
		  </ul>
		  <h1 id="catagoryName"></h1>
	   </div>
	   
	   <div class="panel">
			<table id="gridPage" class="table table-bordered "  data-role="gridscrolllist" >
				<thead>
					<tr>
						<th class="formatter-image"  >图片</th>
						<th class="formatter-name" >名称</th>
						<th class="formatter-price" >价格</th>
						<th class="formatter-editOrDelete th-info" >操作</th>
					</tr>
				</thead>
				<tbody >
					<tr class='grid_tr_templete' >
						<td data-title="图片" width="25%"></td>
						<td data-title="名称"  width="25%"></td>
						<td data-title="价格"  width="25%"></td>
						<td data-title="操作" width="25%"></td>
					</tr>
				</tbody>
			</table>
		   <!-- 
		      data-role="pullToRefresh"   自动化滚动刷新组件
		      data-target-grid='gridPage' 匹配相应table，这里是id为gridPage的table
		      style="height:300px;"   设定滚动区域高度
		    -->
			   <div  id="pullToUP" data-role="pullToRefresh"  data-target-grid='gridPage'  style="height:320px;">
                   <table  >
	                   <tbody>
	                   </tbody>
	                    <tfoot >
							<tr >
								<td colspan="7">
									 <!-- 可定制的工具栏 -->
									<div class="row-fluid pagebar auto-pagebar">
									 
									</div>
								</td>
							</tr>
						</tfoot>
	                   
                   </table>
                   
			  </div>
	</div>
</div>

</body>

</html>